<template>
  <div class="box">
    <div ref="container" class="container"></div>
  </div>
</template>
<script>
import * as echarts from "echarts";

export default {
  props: ["options"],
  methods: {
    initEcharts() {
      this.myChart = echarts.init(this.$refs["container"]);
    },
  },
  watch: {
    options(newV) {
      if (!this.myChart) return false;
      this.myChart.setOption(newV);
    },
  },
  mounted() {
    this.initEcharts();
  },
};
</script>

<style lang="less" scoped>
.box {
  .container {
    width: 300px;
    height: 300px;
  }
}
</style>
